<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/com.css"/>
		<link rel="stylesheet" type="text/css" href="css/booking.css" />
		<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

	</head>

	<body>
		<div>
			<p class="bold bule">预约时间设定</p>
			<div class="cnt">
				<div>
					<ul class="setbooking">
						<li>
							<span>开始日期：</span>
							<div>
								<input type="date" name="" id="" value="" />
							</div>
						</li>
						<li>
							<span>结束日期：</span>
							<div>
								<input type="date" name="" id="" value="" />
							</div>
						</li>
						<li>
							<span>星期日期：</span>
							<ul class="bule ch">
								<li><span class="checkbox"></span><span>星期一</span></li>
								<li><span class="checkbox"></span><span>星期二</span></li>
								<li><span class="checkbox"></span><span>星期三</span></li>
								<li><span class="checkbox"></span><span>星期四</span></li>
								<li><span class="checkbox"></span><span>星期五</span></li>
								<li><span class="checkbox"></span><span>星期六</span></li>
								<li><span class="checkbox"></span><span>星期日</span></li>
							</ul>
						</li>
						<li>
							<span>预约状态：</span>
							<div>

								<select name="" id="">
									<option value="">不可预约</option>
									<option value="">可预约</option>
								</select>
							</div>
						</li>
						<li>
							<span>预约时段：</span>
							<div>
								<p>
									<input type="time" name="" id="" value="" />-
									<input type="time" name="" id="" value="" />
								</p>
								<p style="margin-top: 1rem;">
									<input type="button" name="" id="" class="btn" value="+增加时间段" />
								</p>
							</div>
						</li>
						<li>
							<span>预约单位：</span>
							<div>
								<select name="">
									<option value="">15分钟</option>
									<option value="">30分钟</option>
									<option value="">60分钟</option>
								</select>
							</div>
						</li>
						<li class="sure">
							<input type="button"class="btn su" name="" onclick="go('bookingTime_list')" value="确认" />
							<input type="button"class="btn ca" value="取消" />
						</li>
					</ul>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript">
		$(".ch li").each(function() {
			$(this).attr('bol', 0)
		})
		$(".ch li").on('click', function() {
			var bol = $(this).attr('bol')==0?1:0;
			$(this).attr('bol',bol);
			if(bol) {
				console.log($(this).children('.checkbox'))
				$(this).children('.checkbox').addClass('sel')
			} else {
				$(this).children('.checkbox').removeClass('sel')
			}
		})
		function go(src) {
			console.log(src+'.html')
			window.parent.document.getElementsByTagName('iframe')[0].src = src+'.html';
		}
	</script>

</html>